<template>
  <div class="box">
    <h1 class="main-title">操作日志</h1>
    <div id="OrderInfo" class="page-wrapper">
      <order-table></order-table>
      <order-table2></order-table2>
      <order-table3></order-table3>
    </div>
    <div class="wrapper">
      <order-table4></order-table4>
    </div>
  </div>
</template>

<script>
import OrderTable from './components/coldOrderTable.vue'
import OrderTable2 from './components/hotOrderTable.vue'
import OrderTable3 from './components/electricOrderTable.vue'
import OrderTable4 from './components/OrderTable.vue'
export default {
  name: 'OrderInfo',
  components: {
    OrderTable,
    OrderTable2,
    OrderTable3,
    OrderTable4
  }
}
</script>

<style scoped>
.box {
  width: 100%;
  height: 100%;
}
.page-wrapper {
  display: flex;
  justify-content: space-around;
  align-items: center;
  text-align: center; /* 居中所有文本 */
}
.wrapper {
  margin-top: 40px;
  display: flex;
  justify-content: center;
  width: 100%;
}
</style>
